.cherry-shortcut-key-config-panel-wrapper {
  width: 250px !important;
  height: 400px !important;
  .cherry-shortcut-key-config-panel-inner {
    width: 100%;
    height: 100%;
    overflow: auto;
    // 隐藏滚动条
    &::-webkit-scrollbar {
      display: none;
    }
    .shortcut-top {
      width: 100%;
    }
    .cherry-shortcut-key-config-panel-ul {
      // 去掉列表样式
      list-style: none;
      padding: 0;
      margin: 0;

      .shortcut-key-item {
        display: flex;
        justify-content: space-between;
        height: auto;
        padding: 2px 15px;
        border-top: 1px solid #eee;
        .input-shortcut-wrapper {
          width: 100px;
          input {
            width: 100%;
          }
        }
        .shortcut-key-config-panel-name {
          max-width: 120px;
        }
        .shortcut-key-config-panel-kbd {
          display: flex;
          gap: 10px;
          min-width: 120px;
          justify-content: right;

          .keyboard-key {
            border-radius: 3px;
            border-style: solid;
            border-width: 1px;
            display: inline-block;
            font-size: 11px;
            margin: 0 2px;
            padding: 3px 5px;
            vertical-align: middle;
            line-height: 20px;
            margin: 4px;
            min-width: 16px;
            text-align: center;
          }
        }
      }
    }
  }
  .shortcut-static {
    .cherry-shortcut-key-config-panel-ul {
      gap: 0;
      .shortcut-key-item {
        cursor: default;
        .shortcut-key-config-panel-static {
          display: flex;
          gap: 3px;
          min-width: 80px;
          justify-content: right;
          .shortcut-split {
            color: #aaa;
          }
        }
      }
    }
  }
  .shortcut-panel-title, .shortcut-panel-settings {
    font-size: 14px;
    padding: 10px 15px;
    background-color: #eee; 
    // border-bottom: 1px solid #888;
    // border-top: 1px solid #888;
  }
  .shortcut-panel-settings {
    padding: 10px 15px;
    font-size: 12px;
    cursor: pointer;
    user-select: none;
    border-bottom: 1px solid #aaa;
    justify-content: space-between;
    display: flex;
    .shortcut-settings-btn {
      height: auto;
      line-height: 1.2em;
      &:hover {
        color: rgb(255, 77, 79);
      }
    }
  }
  &.disable {
    .cherry-shortcut-key-config-panel-ul {
      opacity: 0.3;
    }
    .j-shortcut-settings-disable-btn {
      color: rgb(255, 77, 79);
    }
  }
}
